<script setup lang='ts'>
import ChannelNav from '../../components/ChannelNav.vue';
import ArticleList from '../../components/ArticleList.vue'
import { useChannels } from '@/hooks/channels';
const { activeId, channelList} = useChannels()
const checkTabBar = (id: number) => {
  activeId.value=id
  
    }
</script>
<template>
    <ChannelNav 
    :active-id="activeId"
    :channels="channelList"
    @check-tab-bar="checkTabBar"></ChannelNav>
  <ArticleList 
  :active-id="activeId"></ArticleList>
  <div class="fix">
  <router-view></router-view>
  </div>
</template>
<style scoped>
.fix{
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
}
</style>